import React, { useState, useEffect } from "react";
import CommonModal from '@/components/CommonModal';
import CommonLoading from '@/components/CommonLoading';
import { Form, Radio, message } from 'antd';
import { getGoodsSet, setGoodsSet } from '../service';

export default ({ visible, handleOk, handleCancel, roleType }) => {

  const [form] = Form.useForm();

  const [loading, setLoading] = useState(false)

  useEffect(() => {
    if(visible) {
      queryGoodsSet();
    }
  }, [visible])

  //获取目前的设置值
  const queryGoodsSet = async () => {
    setLoading(true);
    const { success, data } = await getGoodsSet();
    if(success) {
      const { isGetGoods = 2 } = data;
      form.setFieldsValue({
        type: isGetGoods
      })
    }
    setLoading(false);
  }

  const onOk = () => {
    form.validateFields().then(val => {
      setGoods(val);
    }).catch(err => {
      console.log(err);
    }) 
  }

  //智能商品设置
  const setGoods = async (val) => {
    setLoading(true);
    const { success } = await setGoodsSet({
      ...val
    })
    if (success) {
      message.success('智能设置成功');
      handleOk();
    }
    setLoading(false);
  }

  return (
    <>
      <CommonModal
        title="智能商品设置"
        visible={visible}
        onCancel={handleCancel}
        onOk={onOk}
        width={472}
      >
        <div className="form_box">
          <Form
            name="mind-set-goods"
            form={form}
          >

            <Form.Item
              label=""
              name="type"
            >
              <Radio.Group>
                {roleType == 'daifa' ? '' : <Radio style={{ marginBottom: 15 }} value={1}>已匹配商品自动为自发拿货商品（更换了匹配关系时）</Radio>}<br></br>
                <Radio style={{ marginBottom: 15 }} value={2}>已匹配商品自动为代发拿货商品（更换了匹配关系时）</Radio><br></br>
                <Radio value={3}>已匹配的商品仍旧为库存商品不变（更换了匹配关系时）</Radio>
              </Radio.Group>
            </Form.Item>

          </Form>
        </div>
      </CommonModal>
      <CommonLoading loading={loading} />
    </>
  )
}